<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=Edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>郭文明-小郭-吉他锅-仔仔网络博客-小郭个人博客-绝情的吉他-web前端</title>
	<meta name="keywords" content="郭文明,小郭,吉他锅,仔仔网络博客,小郭个人博客,绝情的吉他,web前端">
	<meta name="description" content="大家好,我的名字叫郭文明,通常别人都喜欢叫我的英文名Andy和小郭,我是一个假程序猿吧,我喜欢代码,如果你也喜欢代码或是你有需求,我相信我们可以成为朋友哦,qq:594649546,tel:13711805852">
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/font-awesome.min.css">
	<link rel="stylesheet" href="css/style.css">
</head>
<style>
body{
	
}
.title{
	font-size: 45px;
	padding-bottom: 30px;
}
.col-md-8 .tm-home-subtitle{
	font-size: 34px;
}
.fa-pinterest:before{
	content: "\f0e0";
}
.fa-twitter:before{
	content: "\f18a";
}
.fa-facebook:before{
	content: "\f0c1"
}
h4.tm-social-title{
	font-family: "微软雅黑";
}
.media-body h3{
	font-size: 16px;
	text-transform: none;
}
.navbar-default .navbar-nav>.active>a{
	color: #202020;
	background-color: transparent;
}
.navbar-default .navbar-nav > .current > a{
	color: #eb5424;
    background-color: transparent;
}
#tip-arrow-top,#tip-arrow-bottom,#trans-tooltip{
	display: none;
}
</style>
<body data-spy="scroll" data-target="#rock-navigation">
	<!-- START NAVIGATION -->
	<div class="navbar navbar-default bs-dos-nav navbar-fixed-top sticky-navigation" role="navigation">
		<div class="container">

			<div class="navbar-header">
				<button class="navbar-toggle" data-toggle="collapse" data-target="#rock-navigation">
					<span class="icon icon-bar"></span>
					<span class="icon icon-bar"></span>
					<span class="icon icon-bar"></span>
				</button>
				<a href="http://www.d163.net" class="navbar-brand">Andy</a>
			</div>
			<nav class="collapse navbar-collapse" id="rock-navigation">
				<ul class="nav navbar-nav navbar-right main-navigation text-uppercase">
					<li><a href="#home" class="smoothScroll">首页</a></li>
					<li><a href="#work" class="smoothScroll">我的工作</a></li>
					<li><a href="#portfolio" class="smoothScroll">我的作品</a></li>
					<li><a href="#resume" class="smoothScroll">我的简历</a></li>
					<li><a href="#about" class="smoothScroll">关于我</a></li>
					<li><a href="#contact" class="smoothScroll">联系我</a></li>
					<li><a href="###" class="smoothScroll">英文版</a></li>
				</ul>
			</nav>

		</div>
	</div>
	<!-- END NAVIGATION -->

	<!-- START HOME -->
	<section id="home" class="home">
		<div class="container">
			<div class="row">
				<div class="col-md-2 col-sm-1"></div>
				<div class="col-md-8 col-sm-10">
					<h1 class="tm-home-title"><strong>郭文明</strong></h1>
					<h2 class="tm-home-subtitle">web前端工程师</h2>
					<p>Hi！欢迎进入小郭的个人网站、你们可以叫我<strong>小郭</strong>也可以叫我的英文名<strong>Andy</strong>，当然还有一些常用的小名啦，<strong>吉他锅、仔仔</strong>，我喜欢代码，喜欢音乐，听着音乐写代码就是最快乐的事,善于用SublimeText编写HTML+CSS+javascript。另外我还是一位<strong>iHomeC</strong>的建筑师,让我们一起去创造吧！</p>
					<a href="#work" class="btn btn-default smoothScroll tm-view-more-btn">Let's Begin</a>
				</div>
				<div class="col-md-2 col-sm-1"></div>
			</div>
		</div>
	</section>
	<!-- END HOME -->

	<!-- START work -->
	<section id="work" class="tm-padding-top-bottom-100">
		<div class="container">
			<div class="row">
				<div class="col-md-offset-1 col-md-11" style="margin-left:0;">
					<h2 class="title">我的 <strong>工作</strong></h2>						
				</div>
				<div class="col-md-4 col-sm-4">
					<div class="work-wrapper">
						<i class="fa fa-link"></i>
						<h3 class="text-uppercase tm-work-h3">用户体验</h3>
						<hr>
						<p>网页打开速度、SEO优化、交互体验、网站各种疑难杂症<br>(~_~)</p>
					</div>
				</div>
				<div class="col-md-4 col-sm-4">
					<div class="work-wrapper">
						<i class="fa fa-flash"></i>
						<h3 class="text-uppercase tm-work-h3">网页设计</h3>
						<hr>
						<p>根据客户的需求、不同的行业设计出不同网站版面效果、高端大气上档次<br>(~_~)</p>
					</div>
				</div>
				<div class="col-md-4 col-sm-4">
					<div class="work-wrapper">
						<i class="fa fa-dashboard"></i>
						<h3 class="text-uppercase tm-work-h3">前端制作</h3>
						<hr>
						<p>善于用SublimeText编写HTML+CSS+JS<br>(~_~) </p>
					</div>
				</div>
			</div>
		</div>
	</section>
	<!-- END work -->
    <div class="copyrights">Collect from <a target="_blank" href="http://andywenming.cnblogs.com/">绝情的吉他</a></div>

	<!-- START PORTFOLIO -->
	<section id="portfolio" class="tm-portfolio">
		<div class="container">
			<div class="row">
				<div class="col-md-12 wow bounce">
					<div class="title">
						<h2 class="tm-portfolio-title">我的 <strong>作品</strong></h2>
					</div>

					<!-- START ISO SECTION -->
					<div class="iso-section">
						<ul class="filter-wrapper clearfix">
							<li><a href="javascript:;" class="opc-main-bg selected" data-filter="*">All</a></li>
							<li><a href="javascript:;" class="opc-main-bg" data-filter=".html">HTML</a></li>
							<li><a href="javascript:;" class="opc-main-bg" data-filter=".photoshop">Photoshop</a></li>
							<!-- <li><a href="javascript:;" class="opc-main-bg" data-filter=".wordpress">Wordpress</a></li> -->
							<li><a href="javascript:;" class="opc-main-bg" data-filter=".mobile">Mobile</a></li>
						</ul>
						<div class="iso-box-section">
							<div class="iso-box-wrapper col4-iso-box">
								<a href="">
								<div class="iso-box photoshop col-md-3 col-sm-3 col-xs-12">
									<div class="portfolio-thumb">
										<img src="images/portfolio-img1.jpg" class="fluid-img" alt="portfolio img">
										<div class="portfolio-overlay">
											<h3 class="portfolio-item-title">作品简介</h3>
											<p>理财狂欢节  这个冬季不再冷</p>
										</div>
									</div>
								</a>
								</div>
								<div class="iso-box html col-md-3 col-sm-3 col-xs-12">
									<a href="">
									<div class="portfolio-thumb">
										<img src="images/portfolio-img2.jpg" class="fluid-img" alt="portfolio img">
										<div class="portfolio-overlay">
											<h3 class="portfolio-item-title">作品简介</h3>
											<p>游戏试玩网页首页设计</p>
										</div>
									</div>
									</a>
								</div>
								<div class="iso-box html photoshop col-md-3 col-sm-3 col-xs-12">
									<a href="">
									<div class="portfolio-thumb">
										<img src="images/portfolio-img3.jpg" class="fluid-img" alt="portfolio img">
										<div class="portfolio-overlay">
											<h3 class="portfolio-item-title">作品简介</h3>
											<p>圣诞节素材 免费下载</p>
										</div>
									</div>
									</a>
								</div>
								<div class="iso-box html col-md-3 col-sm-3 col-xs-12">
									<a href="">
									<div class="portfolio-thumb">
										<img src="images/portfolio-img4.jpg" class="fluid-img" alt="portfolio img">
										<div class="portfolio-overlay">
											<h3 class="portfolio-item-title">作品简介</h3>
											<p>站长联盟首页,推广联盟首页,独有的ALS</p>
										</div>
									</div>
									</a>
								</div>
								<div class="iso-box html col-md-3 col-sm-3 col-xs-12">
									<a href="">
									<div class="portfolio-thumb">
										<img src="images/portfolio-img5.jpg" class="fluid-img" alt="portfolio img">
										<div class="portfolio-overlay">
											<h3 class="portfolio-item-title">作品简介</h3>
											<p>弹窗设计,红包设计,理财图标设计</p>
										</div>
									</div>
									</a>
								</div>
								<div class="iso-box html col-md-3 col-sm-3 col-xs-12">
									<a href="">
									<div class="portfolio-thumb">
										<img src="images/portfolio-img6.jpg" class="fluid-img" alt="portfolio img">
										<div class="portfolio-overlay">
											<h3 class="portfolio-item-title">作品简介</h3>
											<p>推广页面,竞价页面,站长联盟,佣金榜</p>
										</div>
									</div>
									</a>
								</div>
								<div class="iso-box photoshop col-md-3 col-sm-3 col-xs-12">
									<a href="">
									<div class="portfolio-thumb">
										<img src="images/portfolio-img7.jpg" class="fluid-img" alt="portfolio img">
										<div class="portfolio-overlay">
											<h3 class="portfolio-item-title">作品简介</h3>
											<p>海报设计,桌松的海报教程,复仇者联盟海报合成教程</p>
										</div>
									</div>
									</a>
								</div>
								<div class="iso-box mobile photoshop col-md-3 col-sm-3 col-xs-12">
									<a href="">
									<div class="portfolio-thumb">
										<img src="images/portfolio-img8.jpg" class="fluid-img" alt="portfolio img">
										<div class="portfolio-overlay">
											<h3 class="portfolio-item-title">作品简介</h3>
											<p>第五十五期每周临摹：描边风格图标教程</p>
										</div>
									</div>
									</a>
								</div>
								<div class="iso-box html col-md-3 col-sm-3 col-xs-12">
									<a href="">
									<div class="portfolio-thumb">
										<img src="images/portfolio-img9.jpg" class="fluid-img" alt="portfolio img">
										<div class="portfolio-overlay">
											<h3 class="portfolio-item-title">作品简介</h3>
											<p>暑期专题活动页设计,乐豆玩豪礼送不停</p>
										</div>
									</div>
									</a>
								</div>
								<div class="iso-box mobile photoshop col-md-3 col-sm-3 col-xs-12">
									<a href="">
									<div class="portfolio-thumb">
										<img src="images/portfolio-img10.jpg" class="fluid-img" alt="portfolio img">
										<div class="portfolio-overlay">
											<h3 class="portfolio-item-title">作品简介</h3>
											<p>跟着设计总监学设计--练习作品00 至设计</p>
										</div>
									</div>
									</a>
								</div>
								<div class="iso-box html col-md-3 col-sm-3 col-xs-12">
									<a href="">
									<div class="portfolio-thumb">
										<img src="images/portfolio-img11.jpg" class="fluid-img" alt="portfolio img">
										<div class="portfolio-overlay">
											<h3 class="portfolio-item-title">作品简介</h3>
											<p>网站首页--游戏/金融推广的门户网站</p>
										</div>
									</div>
									</a>
								</div>
								<div class="iso-box html mobile photoshop col-md-3 col-sm-3 col-xs-12">
									<a href="">
									<div class="portfolio-thumb">
										<img src="images/portfolio-img12.jpg" class="fluid-img" alt="portfolio img">
										<div class="portfolio-overlay">
											<h3 class="portfolio-item-title">UX Design</h3>
											<p>2015网页设计作品合集，浅水愚的站酷个人主页</p>
										</div>
									</div>
									</a>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</section>
	<!-- END PORTFOLIO -->

	<!-- START RESUME -->
	<section id="resume" class="tm-padding-top-bottom-100">
		<div class="container">
			<div class="row">
				<div class="col-md-6 col-sm-6">					
					<h2 class="title">我的 <strong>资料</strong></h2>
					<p><span class="tm-info-label">姓名</span> 郭文明</p>
					<p><span class="tm-info-label">生日</span> 1987.06.29</p>
					<p><span class="tm-info-label">住址</span> 广东省东莞市厚街康乐南路</p>
					<p><span class="tm-info-label">电话</span> 137 1180 5852</p>
					<p><span class="tm-info-label">邮箱</span> vip@d163.net</p>
					<p><span class="tm-info-label">网站</span> <a href="//www.d163.net" class="tm-red-text">www.d163.net</a></p>
				</div>
				<div class="col-md-6 col-sm-6">
					<h2 class="title"><strong>一些</strong> 技巧</h2>
					<p>众里寻她千百度 蓦然回首 那人却在灯火阑珊处</p>
					<h4 class="tm-progress-label">div+css bootstrap<small class="progress-percent-small">99.99%</small></h4>
					<div class="progress tm-progress">
						<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%;"></div>
					</div>
					<h4 class="tm-progress-label">DedeCms  Wordpress <small class="progress-percent-small">90%</small></h4>
					<div class="progress tm-progress">
						<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="90" style="width: 90%;"></div>
					</div>
					<h4 class="tm-progress-label">HTML5 CSS3 <small class="progress-percent-small">80%</small></h4>
					<div class="progress tm-progress">
						<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="80" style="width: 80%;"></div>
					</div>
					<h4 class="tm-progress-label">装逼 <small class="progress-percent-small">80%</small></h4>
					<div class="progress tm-progress">
						<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%;"></div>
					</div>
				</div>
			</div>
		</div>
	</section>
	<!-- END RESUME -->

	<!-- START ABOUT -->
	<section id="about" class="tm-about">
		<div class="container">
			<div class="row">
				<div class="col-md-offset-6 col-md-6 col-sm-offset-6 col-sm-7" style="background: rgba(255,255,255,.8);color:#333;margin-left: 0;">
					<div class="title">
						<h2>这是 <strong>我</strong></h2>
						<h1 class="tm-red-text">Andy <strong>史蒂夫</strong>  <span style="font-size:14px">?</span></h1>
					</div>
					<p>哈哈，我不是史蒂夫，我是吉他锅</p>
					<p>吉他锅:“<(￣▽￣)> 在我们设计行业里有位牛人，刚刚出来实习第一个月就收入18万，你知道是谁吗？”</p>
					<p>上铺基佬：“最近我看到你个人主页上晒的收入单了，可是我闭着眼睛都觉得你做的设计很丑”</p>
					<p>吉他锅:“是啊，因为设计的太丑了，被老板打断了腿，然后公司给赔的。”</p>
					<p>上铺基佬：“What! (๑ŐдŐ)b ”</p>
				</div>
			</div>
		</div>
	</section>
	<!-- END ABOUT -->

	<!-- START SOCIAL -->
	<section id="social" class="tm-social">
		<div class="container">
			<div class="row">
				<div class="col-md-4 col-sm-4 wow rotateInUpLeft" data-wow-delay="0.3s">
					<div class="media facebook">
						<a href="https://github.com/andywenming"  target="_blank">
							<div class="media-object pull-left">
								<i class="fa fa-facebook"></i>
							</div>
							<div class="media-body">
								<h4 class="media-heading tm-social-title">郭文明的GitHub</h4>
								<h3>GitHub</h3>
							</div>
						</a>
					</div>
				</div>
				<div class="col-md-4 col-sm-4 wow rotateInUpLeft" data-wow-delay="0.6s">
					<div class="media twitter">
						<a href="http://weibo.com/andywenming" target="_blank">
							<div class="media-object pull-left">
								<i class="fa fa-twitter"></i>
							</div>
							<div class="media-body">
								<h4 class="media-heading tm-social-title">郭文明的微博</h4>
								<h3>Social Weibo</h3>
							</div>
						</a>
					</div>
				</div>
				<div class="col-md-4 col-sm-4 wow rotateInUpLeft" data-wow-delay="0.9s">
					<div class="media pinterest">
						<a href="mailto:andywenming@163.com" target="_blank">
							<div class="media-object pull-left">
								<i class="fa fa-pinterest"></i>
							</div>
							<div class="media-body">
								<h4 class="media-heading tm-social-title">写信给我</h4>
								<h3>Social Mail</h3>
							</div>
						</a>
					</div>
				</div>
			</div>
		</div>
	</section>
	<!-- END SOCIAL -->

	<!-- START CONTACT -->
	<section id="contact" class="tm-contact">
		<div class="container">
			<div class="row">
				<div class="col-md-12">					
					<h2 class="title">评论 <strong>留言</strong></h2>
					<hr>					
				</div>
				<div class="col-md-1 col-sm-1"></div>

				<!--高速版-->
				

				<!-- 畅言评论，记得自行修改成自己的appid  conf -->
				<div id="SOHUCS"></div> 
				 <script type="text/javascript"> 
				(function(){ 
				var appid = 'cyt0EAjBM'; 
				var conf = 'prod_a02f84a49cab24f25eb03f73fe404c3c'; 
				var width = window.innerWidth || document.documentElement.clientWidth; 
				if (width < 960) { 
				window.document.write('<script id="changyan_mobile_js" charset="utf-8" type="text/javascript" src="http://changyan.sohu.com/upload/mobile/wap-js/changyan_mobile.js?client_id=' + appid + '&conf=' + conf + '"><\/script>'); } else { var loadJs=function(d,a){var c=document.getElementsByTagName("head")[0]||document.head||document.documentElement;var b=document.createElement("script");b.setAttribute("type","text/javascript");b.setAttribute("charset","UTF-8");b.setAttribute("src",d);if(typeof a==="function"){if(window.attachEvent){b.onreadystatechange=function(){var e=b.readyState;if(e==="loaded"||e==="complete"){b.onreadystatechange=null;a()}}}else{b.onload=a}}c.appendChild(b)};loadJs("http://changyan.sohu.com/upload/changyan.js",function(){window.changyan.api.config({appid:appid,conf:conf})}); } })(); 
				</script>
				

        

				<div class="col-md-1 col-sm-1"></div>
				<div class="col-md-12 col-sm-12">
					powerd by <a href="#">Andy</a>
				</div>
			</div>
		</div>
	</section>
	<!-- END CONTACT -->
	<script src="js/jquery.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script src="js/smoothscroll.js"></script>
	<script src="js/jquery.nav.js"></script>
	<script src="js/isotope.js"></script>
	<script src="js/imagesloaded.min.js"></script>
	<script src="js/custom.js"></script>

</body>
</html>